<template>
	<view class="container">
			<navigator url="../classify/classify" hover-class="none" class="search">
				<image class="img" src="https://m.nocexpo.com/statics/js/modules/h5/img/search_logo.jpg" mode="widthFix" />

				<view class="icon-input">
					<uni-icons class="icon" color="#383838" type="search" size="20"></uni-icons>
					<input placeholder="搜索展商、产品" placeholder-class="input" @keyup.enter="queryByInput" v-model="params.inputWord" @blur="queryByInput"/>
				</view>
			</navigator>
		<scroll-view scroll-y class="scroll-view" @scroll="scroll" @scrolltolower="onRefresh" :scroll-top="scrollTop">
			<swiper class="swiper" :indicator-dots="true" indicator-active-color="#ffffff" indicator-color="rgba(255,255,255,0.32)">
				<swiper-item v-for="(item,index) in bannerList" :key="index">
					<image class="bannerImg" :src="item.bannerUrl" mode="widthFix"/>
				</swiper-item>
			</swiper>
		<!-- 	<image class="bannerImg"
				src="https://img1.baidu.com/it/u=2126200438,2832966780&fm=253&fmt=auto&app=138&f=JPEG?w=1280&h=475"
				mode="widthFix" /> -->
			<view class="announcement">
				<image class="img" src="https://m.nocexpo.com/statics/js/modules/h5/img/icon56.png" mode="widthFix" />
				{{exhibitionShortName}}最新公告：参展商{{canzhanCount}}家，展品{{productsCount}}个
			</view>
			<view class="c">
				<view v-show="joinExhibitionFlag">
					<view class="s-title">申请报名参加本届展会</view>
					<view class="s-btn">
						<view @click="bindingExhibition()">展位预定</view>

						<view @click="toFormUrl()">{{btnValue}}</view>
					</view>
				</view>
				<view class="video-title" v-if="videoList.length > 0 && isShowVideo">
					展商视频推荐
					<navigator class="url" @click="toBannerLink()">
						更多推荐
						<uni-icons class="icon" color="#d8d7dc" type="right" size="17"></uni-icons>
					</navigator>
				</view>
				<view class="video-data" v-if="videoList.length > 0 && isShowVideo">

					<view class="item" v-for="(item,index) in videoList" :key="item.id" @click="toVideoDetail(item.id)">
						<image class="img" 
							:src="item.coverImg? item.coverImg:(item.videoUrl + '?x-oss-process=video/snapshot,t_7000,f_jpg,m_fast')" mode="aspectFill" />
						<view class="date">{{item.videoDuration}}</view>
						<view class="title">{{item.videoTitle}}</view>
						<view class="user-collent">
							<view class="user">
								<image class="avatar"
									:src="item.author.portrait ? item.author.portrait : '/static/image/wutouxiang.png'"
									mode="widthFix" />
								<view class="text">{{item.author.userName}}</view>
							</view>
							<!-- :src="item.author.protrait?item.author.protrait : 'https://img1.baidu.com/it/u=1268603822,1552453616&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500'" -->
							<view class="collent" v-if="item.like==null">
								<uni-icons class="icon" color="#bcbcc4" type="heart" size="16" @tap.stop="giveVideoList(item.id,index)"></uni-icons>
								{{item.likeCount}}
							</view>
							<view class="collent" v-else>
								<uni-icons class="icon" color="#FF0000" type="heart" size="16" @tap.stop="cancelVideoList(item.like,index)"></uni-icons>
								{{item.likeCount}}
							</view>
						</view>
					</view>
				</view>
				<view class="brisk-title">
					<uni-icons class="icon" color="#ffaa09" type="vip-filled" size="23"></uni-icons>
					本届展商活跃排名
				</view>
				<view class="brisk-btn">
					<view :class="[index==1?'active':'']" @click="tabsClick(1)">展馆筛选</view>
					<view :class="[index==2?'active':'']" @click="tabsClick(2)">产品筛选</view>	
				</view>
				<view class="nums" v-show="changeTabsShow">
					<view class="data">
						<view class="item" v-for="(item,index) in showRoomList" :key="index" :class="[item.actived==true?'actived':'']"   @click="trademark(item)">{{item.roomName}}</view>
						
					</view>
					<view class="judge-btn">
						<view class="" @click="reset()">重置</view>
						<view class="" @click="confirm()">确定</view>
					</view>
				</view>
				<scroll-view scroll-x class="menu-list">

					<view class="item" :class="{active:-1==activeIndex}" @click="indexSearchByWord(null,2,-1)">
						<view>全部</view>
						<image class="imga" src="https://m.nocexpo.com/statics/js/modules/h5/img/banhu.png" mode="widthFix" />
					</view>
					<view class="item" v-for="(proClassify,index) in searchProductClassifyList"
						:class="{active:index==activeIndex}" @click="indexSearchByWord(proClassify,2,index)">
						<view>{{proClassify.className}}</view>
						<image class="imga" src="https://m.nocexpo.com/statics/js/modules/h5/img/banhu.png" mode="widthFix" />
					</view>
				</scroll-view>

				<view class="shop-list-data">
					<view class="item" v-for="item in userCloudHomeVoList" :key="item.nocUserEntity.id">
						<view class="head">
							<image class="avatar"
								:src="item.nocUserEntity.logo?item.nocUserEntity.logo:'/static/image/wutouxiang.png'"
								mode="widthFix" />
							<view class="info">
								<view class="title">
									{{item.nocUserEntity.company?item.nocUserEntity.company.substring(0,20):''}}
									<view class="btn" @click="toShowroom(item.nocUserEntity.id)">进店</view>
								</view>
								<view class="attr">
									<view class="tag">{{item.nocUserEntity.companyNature}}</view>
									曝光
									<view class="interval">{{item.nocCompanyDataVo.visitCount}}</view>
									对接用户
									<view class="interval">
										{{item.nocCompanyDataVo.dianzanCount + item.nocCompanyDataVo.collectCount}}
									</view>
									活跃
									<view class="interval">{{item.nocUserEntity.score}}%</view>
								</view>
								<view class="grey"
									style="width: 500rpx; overflow: hidden;white-space: nowrap;text-overflow: ellipsis; color: #A1A0A0;">主营：
									<view class="cls" v-for="(cls,index) in item.classifys" :key="cls">
										<view class="cls" v-show="index!=0">|</view>
										{{cls}}
									</view>
								</view>
								<!--所属展会标签-->
								<view class="main" v-for="(ee,index) in item.exhibitionEntity" style="position: relative;">
								  <view :style="{background:(ee.fontBackgroundColor?ee.fontBackgroundColor:'#EBEDFF'),opacity: 0.2, borderRadius: '30rpx'}">
									<view style="padding:0 10rpx 0 10rpx;" :style="{color:(ee.fontColor ? ee.fontColor:'#6A76FF'),opacity: 1}">{{ee.exhibitionShortName}}</view>
								  </view>
								  <view style="position:absolute;top:0px;padding:0 10rpx 0 10rpx;" :style="{color:(ee.fontColor ? ee.fontColor:'#6A76FF'),opacity: 1}">{{ee.exhibitionShortName}}</view>
								</view>
							</view>
						</view>
						<view class="list">
							<navigator class="url" v-for="dd in item.productEntities" :key="dd.id" @click="toProductDetail(dd.id)">
								<image style="height:84px" class="img" :src="dd.banarImg" />
							</navigator>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
    <!--
		<uni-popup ref="qrCode" type="center">
			<view v-if="!ifBefore" >
				<view style="display: flex;align-items: center;flex-direction: column;z-index:99999">
					<view style="width: 700rpx;height: auto;background-color: #0686a3;border-radius:20px;display: flex;flex-direction: column;justify-content: center;align-items:center">
						<view style="margin-top:35rpx;margin-bottom:35rpx;width: 400rpx;background-color: #0686a3;display: flex;justify-content: center">
							<view style="color: white;font-size: 16px;font-weight: bold;text-align: center;">{{ticket.exhibitionName}}</view>
						</view>
						<view style="background-image:url('/static/image/qrcode_background.png');background-size:100% 100%;width: 500rpx;height:700rpx border-radius:16px;display: flex;flex-direction: column;align-items:center">
							<view style="margin-top:35rpx;color:#0686a3;font-size: 14px;font-weight: 600">{{ticket.spectatorType}}·电子门票</view>
							<view style="margin-top:20rpx;margin-bottom:20rpx;width:350rpx;border-top:1px dashed #0686a3;height: 1px;overflow:hidden"></view>
							<view style="margin-top:20rpx;color:#0686a3;font-size: 14px;font-weight: 600">{{ticket.company}}</view>
							<view style="margin-bottom:15rpx;color:#0686a3;font-size: 14px;font-weight: 600">{{ticket.nickName}}</view>
						</view>
						<view style="margin-top:30rpx;width:500rpx;height:100rpx;background-color: #0686a3;display: flex;justify-content: center">
							<view style="color: white;font-size: 12px;">感谢您参观{{ticket.exhibitionName}},凭身份证或此二维码至展会现场入口处扫码入场!</view>
						</view>
					</view>
					<view style="width: 100%;display: flex;justify-content: center;margin-top: 35rpx">
						<image  @click="$refs.qrCode.close()" style="width: 70rpx;height: 70rpx" src="/static/image/layerCloseBtn.png"/>
					</view>
				</view>
			</view>
			<view v-else >
				<view style="display: flex;align-items: center;flex-direction: column;z-index:99999">
					<view style="width: 700rpx;height: auto;background-color: #0686a3;border-radius:20px;display: flex;flex-direction: column;justify-content: center;align-items:center">
						<view style="margin-top:35rpx;margin-bottom:35rpx;width: 400rpx;background-color: #0686a3;display: flex;justify-content: center">
							<view style="color: white;font-size: 16px;font-weight: bold;text-align: center;">{{ticket.exhibitionName}}</view>
						</view>
				
						<view style="background-image:url('/static/image/qrcode_background.png');background-size:100% 100%;width: 500rpx;height: 700rpx;border-radius:16px;display: flex;flex-direction: column;align-items:center">
							
							<view style=";color:#0b83a0;font-size: 20px;font-weight: 600;margin-top: 300rpx;display: flex;">
								<img  style="width: 35rpx;height: 35rpx;margin-right: 10rpx;" src="/static/image/icon223.png"/>
								<view >您已报名成功</view>
							</view>
								
							<view style="margin-bottom:15rpx;font-size: 12px;margin-top: 15rpx;">注：开展期间将自动生成二维码</view>
						</view>
						<view style="margin-top:30rpx;width: 500rpx;height: 100rpx;background-color: #0686a3;display: flex;justify-content: center">
							<view style="color: white;font-size: 12px;">感谢您参观{{ticket.exhibitionName}},凭身份证或此二维码至展会现场入口处扫码入场!</view>
						</view>
					</view>
					<view style="width: 100%;display: flex;justify-content: center;margin-top: 35rpx">
						<image style="width: 70rpx;height: 70rpx" @click="$refs.qrCode.close()" src="/static/image/layerCloseBtn.png"/>
					</view>
				</view>
			</view>
		</uni-popup>
	  -->
    <!--弹窗-->
    <ticketPopup types="mp,group" :templateId="exhibition.nocTemplateId" ref="ticketPopup"></ticketPopup>
  </view>

</template>

<script>
	import detailApi from '@/api/exhibitiondetail.js';
	import login from '../../../api/login';
	import commonApi from '@/utils/commonMethod.js'
	export default {
		
		data() {
			return {
				nocTemplateId: '',
				params: {
					search: '',
					page: 1,
					limit: 10,
					lastlage: 0,
					exhibitionId: '',
					showRooms: [],
					inputWord: '',
				},
				userCloudHomeVoList: [],
				liveUsers: [],
				exhibitionShortName: '',
				ifEnd: false,
				bannerList: [],
				canzhanCount: 0,
				productsCount: 0,
				pregFormUrl: '',
				exhibition: '',
				rooms: [],
				showRoomList: [],
				videoList: [],
				liveList: [],
				isShowLive: false,
				isShowVideo: false,
				searchProductClassifyList: [],
				activeIndex: -1,
				scrollTop: 0,
				totalPage: 0,
				currentPage: 1,
				loading: false,
				index:2,
				changeTabsShow:false,
				currentUser:{},
				joinExhibitionFlag:false,
				
				share_title:'',
				share_desc:'',
				share_url:'',
				ticket:'',
				isBefore:'',
				btnValue: '获取门票',
				
				startTime:'', //进入页面时间
				endTime:'',//离开页面时间
				currentUrl:'',//当前页面全路径
			};
		},
		onLoad(options) {
			this.nocTemplateId = options.id;
			this.params.exhibitionId = this.nocTemplateId;
			// var userCloudHomeVoList = JSON.parse(sessionStorage.getItem("userCloudHomeVoList"))
			// var liveUsers = JSON.parse(sessionStorage.getItem("liveUsers"))
			// var search = JSON.parse(sessionStorage.getItem("search"))
			// if (userCloudHomeVoList != null) {
			// 	this.search = search	
			// 	this.userCloudHomeVoList = userCloudHomeVoList
			// 	this.liveUsers = liveUsers
			// }else{
			// 	this.queryCompanyList();
			// }
		},
		mounted() {
			this.getCurrentUser();
			this.queryCompanyList();
			this.getCanzhanCount();
			this.getVideoList();
			this.getLiveList();
			this.getSearchProductClassify();
			
			const pages = getCurrentPages()
			const currentPage =pages[pages.length - 1]
			this.share_url = currentPage.route
			this.currentUrl = currentPage.$page.fullPath
		},
		onShow(){
			setTimeout(()=> {
				if (getApp().globalData.onShow) {
					getApp().globalData.onShow = 0;
					console.log("demo前后台切换之切到前台detail")
				}
				else {
					console.log("demo页面被切换显示detail")
					this.startTime = +new Date();
				}
			}, 100);
		},
		onHide(){
			console.log("hide");
			setTimeout(() => {
				var that = this
				if (getApp().globalData.onHide) {
					getApp().globalData.onHide = 0;
					console.log("还在当前页面活动")
				}
				else {
					that.endTime = +new Date();
					console.log("demo页面停留时间：" + (that.endTime - that.startTime))
					var stayTime = Math.round((that.endTime - that.startTime)/1000);
				   //这里获取到页面停留时间stayTime，然后了可以上报了
				   this.saveFootPrint(stayTime);
				}
			}, 100)
		},
		onUnload() {
			console.log("onUnload");
			setTimeout(() => {
				var that = this
				if (getApp().globalData.onHide) {
					getApp().globalData.onHide = 0;
					console.log("还在当前页面活动")
				}
				else {
					that.endTime = +new Date();
					console.log("demo页面停留时间：" + (that.endTime - that.startTime))
					var stayTime = Math.round((that.endTime - that.startTime)/1000);
				   //这里获取到页面停留时间stayTime，然后了可以上报了
				   this.saveFootPrint(stayTime);
				}
			}, 100)
		},
    // 发送给朋友
		onShareAppMessage: function () {
			return {
				title:this.share_title ? this.share_title : '金诺云展',
        path: '/pages/exhibition/detail/detail?id=' + this.nocTemplateId + '&sourceUserId=' + uni.getStorageSync("userId"),
				desc: this.share_desc ? this.share_desc : '机械加工行业信息双向共享平台',
				imageUrl: this.bannerList[0] ? this.bannerList[0].bannerUrl : '',
				success: function (res) {
					console.info(res + '成功');
					wx.showToast({
						title: '分享成功',
					})
					// 转发成功
				},
				fail: function (res) {
					console.log(res + '失败');
					// 转发失败
				},
			 
			}
		 },
		/*分享朋友圈 */
		onShareTimeline: function() {
			return {
				title: this.share_title ? this.share_title : '金诺云展',
				path: '/pages/exhibition/detail/detail',
        query: 'id='+ this.nocTemplateId + '&sourceUserId=' + uni.getStorageSync("userId"),
				imageUrl:  this.bannerList[0] ? this.bannerList[0] : '',
			}
		},
		methods: {
			saveFootPrint(stayTime){
				commonApi.saveFootPrint(this.currentUser.id,this.startTime,stayTime,this.currentUrl,"展会详情")
				
			},
			async toFormUrl(){
				//判断是否登录
				this.register = await commonApi.getUserLoginFlag();
				if (this.register) {
				  // 跳转登录
				  uni.redirectTo({
				    url: '/pages/account/login/login'
				  })
				  return;
				}
				
				// return;
				let currentRes = await this.getCurrentUser()
				const result = await commonApi.judgeLogin(currentRes);
				if (!result) {
					return
				}
				detailApi.hasSignUp(this.exhibition.nocTemplateId).then(res => {
					let tickets = res.data.list
					if(tickets.length>0){
						//弹出门票
						console.log("弹出门票")
						this.$refs.ticketPopup.openPopup();
						// commonApi.getMemberTicket(tickets[0].id).then(response =>{
						// 	if (Number(response.data.ticket.spectatorType)) {
						// 	    response.data.ticket.spectatorType = '预登记观众'
						// 	} else {
						// 	    response.data.ticket.spectatorType = '专业观众'
						// 	}
								
						// 	this.ticket =  response.data.ticket
						// 	console.log(this.ticket.validStartTime);
						// 	this.ifBefore = (this.ticket.validStartTimeStamp > new Date().getTime());
						// 	console.log(this.ticket.validStartTime);
						// 	this.$refs.qrCode.open()
						// })
					}else{
						//跳转到预登记报名
						console.log("预登记保报名")
						console.log(this.pregFormUrl);
            //弹窗显示内容
            uni.showToast({
              "title": this.pregFormUrl,
              "icon": "none",
            });
						uni.navigateTo({
							url: '/components/webview/webview?url=' + encodeURIComponent(this.pregFormUrl+"&companyId='-1'")
						})
					}
				})
			},
			toBannerLink(){
				uni.reLaunch({
				  url:'/pages/tabBar/find/find?tabIndex=4',
				})
			},
			async bindingExhibition(){
				//判断是否登录
				this.register = await commonApi.getUserLoginFlag();
				if (this.register) {
				  // 跳转登录
				  uni.redirectTo({
				    url: '/pages/account/login/login'
				  })
				  return;
				}
			
				uni.navigateTo({
					url:'/pages/exhibition/bind/bindingExhibition?exhibitionId='+this.nocTemplateId
				})

				
			},
			queryCompanyList() {
				detailApi.queryCompanyList(this.params).then(res => {
					let homeResult = JSON.parse(res.data.homeResult);
					this.currentPage = homeResult.page.currPage;
					this.totalPage = homeResult.page.totalPage;

					this.userCloudHomeVoList = [...this.userCloudHomeVoList, ...homeResult.page.list];
					// this.userCloudHomeVoList = this.userCloudHomeVoList.contact(homeResult.page.list);

					// sessionStorage.setItem("userCloudHomeVoList",JSON.stringify(this.userCloudHomeVoList));
					// sessionStorage.setItem("liveUsers",JSON.stringify(this.liveUsers));
					// sessionStorage.setItem("params",JSON.stringify(this.params));

					this.liveUsers = homeResult.liveUser;
				});
			},
			async getCanzhanCount() {
        detailApi.getCanzhanCount(this.nocTemplateId).then(res => {
					this.exhibitionShortName = res.data.homeResult.exhibitionEntity.exhibitionShortName;
					this.ifEnd = res.data.homeResult.exhibitionEntity.ifEnd;
					if (this.ifEnd) {
						uni.showModal({
							title: "",
							content: "该场展会已结束，是否回到首页浏览",
							success: function(res) {
								if (res.confirm) {
									uni.switchTab({
										url: '/pages/tabBar/index/index',
									})
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						});
					}
					this.share_title = res.data.homeResult.exhibitionEntity.exhibitionShareTitle;
					this.share_desc = res.data.homeResult.exhibitionEntity.exhibitionShareDescribe;
					//获取轮播图，用于微信分享图片
					detailApi.getBannerList(this.nocTemplateId).then(bannerList =>{
						console.log(bannerList);
						this.bannerList = bannerList;
					})
					//微信分享

					this.canzhanCount = res.data.homeResult.canzhanCount;
					this.productsCount = res.data.homeResult.productsCount;
					this.pregFormUrl = res.data.homeResult.exhibitionEntity.pregFormUrl;
					this.exhibition = res.data.homeResult.exhibitionEntity;
					if(this.exhibition != null && this.exhibition != ''){
						this.rooms = this.exhibition.exhibitionShowroom.split('，');
						this.showRoomList = this.rooms.map(item => {
							return {
								roomName: item,
								actived: false,
							}
						})
					}
				})

        this.register = await commonApi.getUserLoginFlag();
        if (!this.register) {
          detailApi.hasSignUp(this.exhibition.nocTemplateId).then(response => {
            let tickets = response.data.list
            if(tickets.length > 0){
              this.btnValue = '门票查看'
            }else{
              this.btnValue = '获取门票'
            }
          })
        }

			},
			getVideoList() {
				detailApi.getVideoList(this.nocTemplateId).then(res => {
					this.videoList = res.data.list;
					this.videoList.forEach((value) => {
						if (value.videoDuration) {
							value.videoDuration = value.videoDuration.slice(-8);
							if (value.videoDuration.length == 8) {
								let timeArray = value.videoDuration.split(":");
								if (timeArray[0] == '00') {
									timeArray[0] == '';
								} else if (timeArray[0].slice(0, 1) == '0') {
									timeArray[0] = timeArray[0].slice(1) + ':';
								} else {
									timeArray[0] = timeArray[0] + ':';
								}
								value.videoDuration = timeArray[0] + timeArray[1] + ':' + timeArray[2];
							}
						}
					})

				})
			},
			getLiveList() {
				detailApi.getLiveList(this.nocTemplateId).then(res => {
					this.liveList = res.data.list;
					if (res.data.list > 0) {
						this.isShowLive = true;
					} else {
						this.isShowVideo = true;
					}

				})
			},
			getSearchProductClassify() {
				detailApi.getSearchProductClassify(this.nocTemplateId).then(res => {
					this.searchProductClassifyList = res.data.list;

				})
			},
			scroll(e) {
				this.scrollTop = e.detail.scrollTo;
				this.$store.dispatch('renewScrollTop', e.detail.scrollTop);
			},
			onRefresh() {
				if (this.currentPage < this.totalPage) {
					this.params.page++;
					this.loading = true;
					console.log("还有下一页" + this.params.page);
					
					this.queryCompanyList();
				} else {	
					
					this.loading = false;
					console.log("没有下一页")
				}
			},
			toProductDetail(id){
				uni.navigateTo({
					url:'/pages/product/productDetail/productDetail?productId=' + id
				})
			},
			tabsClick(e) {
				if(e == 1 && !this.changeTabsShow){
					// this.lockPosition()
				}
				if(this.index == e){
					if(e == 1){
						this.changeTabsShow = !this.changeTabsShow;
						if(!this.changeTabsShow){
							// this.unLockPosition()
						}
						// this.shade = !this.shade;
					}
					return;
				}
				this.index = e;
				if(e == 1){
					this.changeTabsShow = true;
					// this.shade = true;
				}else if(e != 3) {
				}
				if(e != 1){
					this.changeTabsShow = false;
				}
			},
			trademark(item){
				//选中
				if(item.actived){
					item.actived = !item.actived;
				}else{
					item.actived = true;
				}
				this.$forceUpdate()
			},
			reset(){
				this.showRoomList.forEach((item) => {
					item.actived = false;
					this.$forceUpdate();
				})
			},
			confirm(){
				this.params.lastpage = 0
				this.params.page = 1
				this.params.showRooms = []
				this.changeTabsShow = false;
			
				this.showRoomList.forEach((item) => {
					if(item.actived){
						this.params.showRooms.push(item.roomName)
					}
				})
				this.userCloudHomeVoList = [];
				this.queryCompanyList()
			},
			//人气排行的分类搜索
			indexSearchByWord(searchVal, type,activeIndex) {
				// this.lockPosition()
				this.index = 2;
				this.activeIndex = activeIndex;
				switch (type) {
					case 1:
						this.params.search = searchVal.keyword;
						break;
					case 2:
						if (searchVal != null) {
							this.params.search = searchVal.className;
						}else{
							this.params.search = "";
						}
						break
					default:
						break
				}
				this.clickToQuery();
			},
			async clickToQuery(){
						//后台获取不到登录人
						if (this.params.search) {
				  //判断是否登录
				  this.register = await commonApi.getUserLoginFlag();
				  if (!this.register) {
					this.saveSearchKey()
				  }
				}
				// this.$refs.searchKey.blur();
				// sessionStorage.clear();
				this.userCloudHomeVoList = [];
				this.params.page = 1;
				this.params.lastpage = 0;
				// this.searchListShow = false;
				// this.rankingShow = true;
				//this.zhanshangwzShow = true;
				// this.zhanshangListShow = true;
				// this.loading= true;
				// this.noMore= false;
				// this.noData= false;
				this.queryCompanyList();
			},
			saveSearchKey() {
				commonApi.saveSearchKey({keyword:this.params.search})
			},
			queryByInput(){
				// this.lockPosition()
				this.params.lastpage = 0
				this.params.page = 1
				this.userCloudHomeVoList = [];
				// this.noMore= false;
				// this.noData= false;
				this.queryCompanyList()
			},
			getCurrentUser(){
				commonApi.currentUserAxios().then(res =>{
					this.currentUser = res.data.session_user_h5;
					this.ifJoinExhibition()
				});
			},
			giveVideoList(id,index){
				if(this.currentUser.type == 3){
					//跳转到登录页面
				}
				detailApi.giveVideoLike(this.currentUser.id,id).then(res =>{
					this.videoList[index].like = res.data.collection;
					this.videoList[index].likeCount++;
				});
			},
			cancelVideoList(like,index){
				detailApi.cancelVideoList(like).then(res =>{
					this.videoList[index].like = null;
					this.videoList[index].likeCount--;
				});
			},
			ifJoinExhibition(){
				detailApi.ifJoinExhibition(this.currentUser.id,this.nocTemplateId).then(res =>{
					this.joinExhibitionFlag = res.data.joinExhibitionFlag;
				});
			},
			toVideoDetail(videoId){
				uni.navigateTo({
					url:'/pages/product/vidoDetail/vidoDetail?id=' + videoId
				})
			},
			toShowroom(userId){
				uni.navigateTo({
					url:'/pages/product/showroom/showroom?userId=' + userId
				})
			}
		
		}
	};
</script>

<style lang="scss">
	.actived{
		background: #00AAA6 !important;
		// color: #fff;
		// color:red
	}
	.scroll-view{
		height:calc(100% - 130rpx);
	}
	.search {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 100rpx;
		overflow: hidden;
		padding: 0px $interval;
		background: #fff;

		.img {
			width: 70rpx;
			margin-right: 30rpx;
		}

		.icon-input {
			flex: 1;
			display: flex;
			align-items: center;
			height: 68rpx;
			background: #f7f7f7;
			border-radius: 35rpx;

			.icon {
				margin-left: 25rpx;
				margin-right: 18rpx;
			}

			input {
				flex: 1;
				color: $text-color;
			}

			.input {
				color: #a1a0a0;
			}
		}
	}

	.bannerImg {
		width: 100%;
		display: block;
	}

	.cls {
		display: inline-block;
	}

	.announcement {
		padding: $interval-min $interval;
		display: flex;
		align-items: center;
		// color: $text-color-grey;
		color: #8f9aa8;
		background-color: #fff;
	
	.img {
			width: 40rpx;
			margin-right: $interval-min;
		}
	}

	.c {
		padding: 0px $interval;

		.s-title {
			margin: -5 + $interval 0px;
			// color: $color-primary;
			color: #059d9e;
			font-size: $font-size-max + 4;
		}

		.s-btn {
			display: flex;
			justify-content: center;

			view {
				width: 320rpx;
				line-height: 80rpx;
				color: #fff;
				text-align: center;
				border-radius: 10rpx;
				font-size: $font-size-max;
				background-color: #029e9d;
			}

			view:first-child {
				margin-right: $interval-min;
				background-color: #f29804;
			}
		}

		.video-title {
			margin: $interval 0px;
			display: flex;
			font-weight: 600;
			justify-content: space-between;
			font-size: $font-size-max + 4;

			.url {
				font-weight: 500;
				color: #d8d7dc;
				display: flex;
				align-items: center;
				font-size: $font-size-min;
				margin-right: -10rpx;
			}
		}
	
	.video-data {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;

			.item {
				width: 48%;
				border-radius: 20rpx;
				overflow: hidden;
				position: relative;
				background-color: #fff;
				padding-bottom: $interval-min;

				.img {
					width: 100%;
					height: 200rpx;
				}

				.date {
					position: absolute;
					left: 0px;
					top: 0px;
					color: #fff;
					border-bottom-right-radius: 15rpx;
					font-size: $font-size-min;
					text-align: center;
					width: 100rpx;
					padding: 10rpx 0px;
					background: rgba(0, 0, 0, 0.5);
				}

				.title {
					padding: 0px $interval-min;
					margin: 15rpx 0px 20rpx;
				}

				.user-collent {
					padding: 0px $interval-min;
					color: #bcbcc4;
					display: flex;
					justify-content: space-between;

					.user {
						display: flex;
						align-items: center;
						width: 70%;

						.avatar {
							width: 40rpx;
							height: 40rpx;
							border-radius: 50%;
							margin-right: 15rpx;
						}

						.text {
							flex: 1;
							width: 0;
							white-space: nowrap;
							overflow: hidden; //文本超出隐藏
							text-overflow: ellipsis; //文本超出省略号替代
						}
					}

					.collent {
						display: flex;
						align-items: center;

						.icon {
							margin-top: 2rpx;
						}
					}
				}
			}
		}

		.brisk-title {
			margin-top: 60rpx;
			display: flex;
			font-weight: 600;
			align-items: center;
			font-size: $font-size-max + 4;

			.icon {
				margin-right: 20rpx;
			}
		}

		.brisk-btn {
			display: flex;
			justify-content: center;
			margin-top: 45rpx;

			view {
				width: 160rpx;
				line-height: 60rpx;
				text-align: center;
				margin: 0px 80rpx;
				background-color: #fff;
				border-radius: 30rpx;
				font-size: $font-size-max;
			}

			view.active {
				font-weight: bold;
			}
		}

		.nums {

			background-color: #fff;
			margin: 0px -1*$interval;
			margin-top: 25rpx;
			padding-bottom: $interval;

			.data {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				padding: $interval-min 0px;

				.item {
					width: 30%;
					line-height: 60rpx;
					border-radius: 30rpx;
					text-align: center;
					background: $bg-color;
					margin-bottom: $interval-min;
				}
			}

			.judge-btn {
				margin: 0px $interval;
				border: 2rpx solid $color-primary;
				background-color: $color-primary;
				display: flex;
				line-height: 70rpx;
				overflow: hidden;
				border-radius: 35rpx;
				text-align: center;

				view {
					width: 50%;
				}

				view:first-child {
					color: $color-primary;
					;
					background-color: #fff;
				}

				view:last-child {
					color: #fff;
				}
			}
		}

		.menu-list {
			flex-shrink: 1;
			display: flex;
			align-items: center;
			white-space: nowrap;


			margin-top: 25rpx;

			.item {
				display: inline-block;
				margin-right: 40rpx;
				position: relative;
				height: 60rpx;
				font-size: $font-size-max;

				image.imga {
					width: 30rpx;
					position: absolute;
					left: 50%;
					bottom: -0rpx;
					opacity: 0;
					margin-left: -20rpx;
					text-align: center;
				}
			}

			.active {
				font-size: $font-size-max + 4;
				font-weight: 600;

				image.imga {
					opacity: 1;
				}
			}
			
		}

	}
</style>
